<!doctype html>
<html lang="en">


<!-- Mirrored from demo.riktheme.com/undex-1/side-menu-dark/inbox.html by HTTrack Website Copier/3.x [XR&CO'2014], Mon, 21 Oct 2019 10:39:03 GMT -->
<head>
    <meta charset="UTF-8">
    <meta name="description" content="">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <!-- The above 4 meta tags *must* come first in the head; any other head content must come *after* these tags -->

    <!-- Title -->
    <title>Undex - Modern Admin Template</title>

    <!-- Favicon -->
    <link rel="icon" href="img/core-img/favicon.png">

    <!-- These plugins only need for the run this page -->
    <link rel="stylesheet" href="css/default-assets/new/simplemde.min.css">

    <!-- Master Stylesheet [If you remove this CSS file, your file will be broken undoubtedly.] -->
    <link rel="stylesheet" href="style.css">

</head>

<body>
    <!-- Preloader -->
    <div id="preloader"></div>

    <!-- Choose Layout -->
    <div class="choose-layout-area">
        <div class="setting-trigger-icon" id="settingTrigger">
            <i class="ti-settings"></i>
        </div>
        <div class="choose-layout" id="chooseLayout">
            <h6 class="mb-30">Choose A Layout</h6>
            <div class="demos-content">
                <div class="single-demos">
                    <a href="index-2.html"><img src="img/demo/1.png" alt=""></a>
                    <span>Vertical Dark</span>
                </div>
                <div class="single-demos">
                    <a href="http://demo.riktheme.com/undex-1/side-menu/index.html"><img src="img/demo/2.png" alt=""></a>
                    <span>Vertical Light</span>
                </div>
                <div class="single-demos">
                    <a href="http://demo.riktheme.com/undex-1/side-menu-gradient/index.html"><img src="img/demo/3.png" alt=""></a>
                    <span>Sidebar Gradient</span>
                </div>
            </div>
        </div>
    </div>

    <!-- ======================================
    ******* Page Wrapper Area Start **********
    ======================================= -->
    <div class="ecaps-page-wrapper">
        <!-- Sidemenu Area -->
        <div class="ecaps-sidemenu-area">
            <!-- Desktop Logo -->
            <div class="ecaps-logo">
                <a href="index-2.html"><img class="desktop-logo" src="img/core-img/logo.png" alt="Desktop Logo"> <img class="small-logo" src="img/core-img/small-logo.png" alt="Mobile Logo"></a>
            </div>

            <!-- Side Nav -->
            <div class="ecaps-sidenav" id="ecapsSideNav">
                <!-- Side Menu Area -->
                <div class="side-menu-area">
                    <!-- Sidebar Menu -->
                    <nav>
                        <ul class="sidebar-menu" data-widget="tree">
                            <li class="sidemenu-user-profile d-flex align-items-center">
                                <div class="user-thumbnail">
                                    <img src="img/member-img/1.png" alt="">
                                </div>
                                <div class="user-content">
                                    <h6>Ajoy Das</h6>
                                    <span>Pro User</span>
                                </div>
                            </li>
                            <li><a href="index-2.html"><i class="icon_lifesaver"></i> <span>Dashboard</span></a></li>
                            <li><a href="widgets.html"><i class="icon_cog"></i> <span>Widgets</span></a></li>
                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_laptop"></i> <span>Apps</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="calendar.html">- Calendar</a></li>
                                    <li><a href="chat-box.html">- Chat box</a></li>
                                    <li><a href="project-list.html">- Project List</a></li>
                                    <li><a href="project-details.html">- Project Details</a></li>
                                </ul>
                            </li>
                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_drive"></i> <span>UI kit</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="avatar.html">- Avatar</a></li>
                                    <li><a href="buttons.html">- Button</a></li>
                                    <li><a href="card.html">- Card</a></li>
                                    <li><a href="slider.html">- Slider</a></li>
                                    <li><a href="modals.html">- Modals</a></li>
                                    <li><a href="toastr.html">- Toastr</a></li>
                                    <li><a href="preloader.html">- Preloader</a></li>
                                    <li><a href="tab.html">- Tab</a></li>
                                    <li><a href="general.html">- General</a></li>
                                    <li><a href="progressbar.html">- Progressbar</a></li>
                                    <li><a href="notifications.html">- Notification</a></li>
                                    <li><a href="dropdown.html">- Dropdown</a></li>
                                    <li><a href="typography.html">- Typography</a></li>
                                </ul>
                            </li>
                            <li class="active"><a href="inbox.html"><i class="icon_globe-2"></i> <span>Email</span></a></li>
                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_easel"></i> <span>Charts</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="heigh-chart.html">- Heigh Chart</a></li>
                                    <li><a href="flot-chart.html">- Flot Chart</a></li>
                                    <li><a href="metricas-chart.html">- Metrica Chart</a></li>
                                    <li><a href="chartist.html">- Chartist Chart</a></li>
                                    <li><a href="google-chart.html">- Google Chart</a></li>
                                    <li><a href="morris-chart.html">- Morris Chart</a></li>
                                    <li><a href="peity-chart.html">- Peity Chart</a></li>
                                    <li><a href="chart-js.html">- Chart Js</a></li>
                                    <li><a href="c3-charts.html">- C3 Chart</a></li>
                                </ul>
                            </li>

                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_document_alt"></i> <span>Pages</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="blank.html">- Start Page</a></li>
                                    <li><a href="profile.html">- Profile</a></li>
                                    <li><a href="profile-2.html">- Profile 2</a></li>
                                    <li><a href="ribbons.html">- Ribbons</a></li>
                                    <li><a href="clipboard.html">- Clipboard</a></li>
                                    <li><a href="todo-list.html">- Todo List</a></li>
                                    <li><a href="light-box-gallery.html">- Light Box Gallery</a></li>
                                    <li><a href="gallery.html">- Gallery</a></li>
                                    <li><a href="range-slider.html">- Range Slider</a></li>
                                    <li><a href="timeline.html">- Timeline</a></li>
                                    <li><a href="timeline-2.html">- Timeline 2</a></li>
                                    <li><a href="sweet-alert.html">- Sweet Alert</a></li>
                                    <li><a href="nestable-list.html">- Nestable List</a></li>
                                </ul>
                            </li>

                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_documents_alt"></i> <span>Forms</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="basic-form.html">- Basic Form</a></li>
                                    <li><a href="form-validation.html">- Validation</a></li>
                                    <li><a href="rating.html">- Rating</a></li>
                                    <li><a href="form-switchers.html">- Switchers</a></li>
                                    <li><a href="file-upload.html">- File upload</a></li>
                                    <li><a href="form-input-mask.html">- Input Mask</a></li>
                                    <li><a href="form-wizard.html">- Form Wizard</a></li>
                                </ul>
                            </li>

                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_cart_alt"></i> <span>Ecommerce</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="product.html">- Products</a></li>
                                    <li><a href="product-details.html">- Products Details</a></li>
                                    <li><a href="order.html">- Orders</a></li>
                                    <li><a href="cart.html">- Cart</a></li>
                                    <li><a href="checkout.html">- Checkout</a></li>
                                </ul>
                            </li>

                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_table"></i> <span>Tables</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="basic-table.html">- Basic Table</a></li>
                                    <li><a href="data-table.html">- Data Table</a></li>
                                    <li><a href="table-layout-colourd.html">- Table Layout Color</a></li>
                                    <li><a href="price-table.html">- Price Table</a></li>
                                    <li><a href="edit-table.html">- Edit Table</a></li>
                                </ul>
                            </li>
                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_key_alt"></i> <span>User Page</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="login.html">- Login</a></li>
                                    <li><a href="register.html">- Register</a></li>
                                    <li><a href="lock-screen.html">- Lock Screen</a></li>
                                    <li><a href="forget-password.html">- Forget Password</a></li>
                                </ul>
                            </li>

                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_genius"></i> <span>General Pages</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="video.html">- Video</a></li>
                                    <li><a href="session-timeout.html">- Session timeout</a></li>
                                    <li><a href="invoice.html">- Invoice</a></li>
                                    <li><a href="contact.html">- Contact</a></li>
                                    <li><a href="coming-soon.html">- Coming Soon</a></li>
                                    <li><a href="404.html">- 404</a></li>
                                </ul>
                            </li>
                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_map_alt"></i> <span>Maps</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="google-map.html">- Google Map</a></li>
                                    <li><a href="vector-map.html">- Vector Map</a></li>
                                </ul>
                            </li>
                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_shield"></i> <span>Icons</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="matarial-icons.html">- Materialize Icons</a></li>
                                    <li><a href="elegant-icons.html">- Elegant Icons</a></li>
                                    <li><a href="et-line-icons.html">- Et-line Icons</a></li>
                                    <li><a href="font-awesome.html">- Font-Awsome Icons</a></li>
                                    <li><a href="pe-7-stroke.html">- Pe-7 Stroke Icons</a></li>
                                    <li><a href="themify-icons.html">- Themify Icons</a></li>
                                </ul>
                            </li>
                            <li class="treeview">
                                <a href="javascript:void(0)"><i class="icon_menu"></i> <span>Multilevel</span> <i class="fa fa-angle-right"></i></a>
                                <ul class="treeview-menu">
                                    <li><a href="#">Level One</a></li>
                                    <li class="treeview">
                                        <a href="#">Level One <i class="fa fa-angle-right"></i></a>
                                        <ul class="treeview-menu">
                                            <li><a href="#">Level Two</a></li>
                                            <li><a href="#">Level Two</a></li>
                                            <li><a href="#">Level Two</a></li>
                                        </ul>
                                    </li>
                                    <li><a href="#">Level One</a></li>
                                </ul>
                            </li>
                        </ul>
                    </nav>
                </div>
            </div>
        </div>

        <!-- Page Content -->
        <div class="ecaps-page-content">
            <!-- Top Header Area -->
            <header class="top-header-area d-flex align-items-center justify-content-between">
                <div class="left-side-content-area d-flex align-items-center">
                    <!-- Mobile Logo -->
                    <div class="mobile-logo mr-3 mr-sm-4">
                        <a href="index-2.html"><img src="img/core-img/small-logo.png" alt="Mobile Logo"></a>
                    </div>

                    <!-- Triggers -->
                    <div class="ecaps-triggers mr-1 mr-sm-3">
                        <div class="menu-collasped" id="menuCollasped">
                            <i class="zmdi zmdi-menu"></i>
                        </div>
                        <div class="mobile-menu-open" id="mobileMenuOpen">
                            <i class="zmdi zmdi-menu"></i>
                        </div>
                    </div>

                    <!-- Left Side Nav -->
                    <ul class="left-side-navbar d-flex align-items-center">
                        <li class="hide-phone app-search mr-15">
                            <form role="search" class=""><input type="text" placeholder="Search..." class="form-control"> <button type="submit" class="mr-0"><i class="fa fa-search"></i></button></form>
                        </li>
                    </ul>
                </div>

                <div class="right-side-navbar d-flex align-items-center justify-content-end">
                    <!-- Mobile Trigger -->
                    <div class="right-side-trigger" id="rightSideTrigger">
                        <i class="ti-align-left"></i>
                    </div>

                    <!-- Top Bar Nav -->
                    <ul class="right-side-content d-flex align-items-center">
                        <li class="nav-item dropdown">
                            <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><img class="border-radius-none" src="img/core-img/l3.jpg" alt=""></button>
                            <div class="dropdown-menu language-dropdown dropdown-menu-right">
                                <a href="#" class="dropdown-item"><img src="img/core-img/l1.jpg" alt=""> IND</a>
                                <a href="#" class="dropdown-item"><img src="img/core-img/l2.jpg" alt=""> LOP</a>
                                <a href="#" class="dropdown-item"><img src="img/core-img/l3.jpg" alt=""> KYI</a>
                                <a href="#" class="dropdown-item"><img src="img/core-img/l4.jpg" alt=""> RTY</a>
                            </div>
                        </li>
                        <!-- Full Screen Mode -->
                        <li class="full-screen-mode ml-1">
                            <a href="javascript:" id="fullScreenMode"><i class="zmdi zmdi-fullscreen"></i></a>
                        </li>

                        <li class="nav-item dropdown">
                            <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="icon_globe-2" aria-hidden="true"></i></button>

                            <div class="dropdown-menu dropdown-menu-right">
                                <!-- Top Message Area -->
                                <div class="top-message-area">
                                    <!-- Heading -->
                                    <div class="top-message-heading">
                                        <div class="heading-title">
                                            <h6>Messages</h6>
                                        </div>
                                        <span>5 New</span>
                                    </div>
                                    <div class="message-box" id="messageBox">
                                        <a href="#" class="dropdown-item">
                                            <i class="zmdi zmdi-email-open"></i>
                                            <span class="message-text">
                                                <span>6-hour video course on Angular</span>
                                                <span>3 min ago</span>
                                            </span>
                                        </a>
                                        <a href="#" class="dropdown-item">
                                            <i class="zmdi zmdi-email-open"></i>
                                            <span class="message-text">
                                                <span>Google Ads: You'll get a refund soon</span>
                                                <span>27 min ago</span>
                                            </span>
                                        </a>
                                        <a href="#" class="dropdown-item">
                                            <i class="zmdi zmdi-email-open"></i>
                                            <span class="message-text">
                                                <span>New Feature: HTTP Method Selection</span>
                                                <span>56 min ago</span>
                                            </span>
                                        </a>
                                        <a href="#" class="dropdown-item">
                                            <i class="zmdi zmdi-email-open"></i>
                                            <span class="message-text">
                                                <span>The Complete JavaScript Handbook</span>
                                                <span>1 hour ago</span>
                                            </span>
                                        </a>
                                        <a href="#" class="dropdown-item">
                                            <i class="zmdi zmdi-email-open"></i>
                                            <span class="message-text">
                                                <span>New comment: ecaps Template</span>
                                                <span>2 days ago</span>
                                            </span>
                                        </a>
                                        <a href="#" class="dropdown-item">
                                            <i class="zmdi zmdi-email-open"></i>
                                            <span class="message-text">
                                                <span>6-hour video course on Angular</span>
                                                <span>3 min ago</span>
                                            </span>
                                        </a>
                                        <a href="#" class="dropdown-item">
                                            <i class="zmdi zmdi-email-open"></i>
                                            <span class="message-text">
                                                <span>Google Ads: You'll get a refund soon</span>
                                                <span>27 min ago</span>
                                            </span>
                                        </a>
                                        <a href="#" class="dropdown-item">
                                            <i class="zmdi zmdi-email-open"></i>
                                            <span class="message-text">
                                                <span>New Feature: HTTP Method Selection</span>
                                                <span>56 min ago</span>
                                            </span>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </li>

                        <li class="nav-item dropdown">
                            <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="icon_lightbulb_alt" aria-hidden="true"></i> <span class="active-status"></span></button>
                            <div class="dropdown-menu dropdown-menu-right">
                                <!-- Top Notifications Area -->
                                <div class="top-notifications-area">
                                    <!-- Heading -->
                                    <div class="notifications-heading">
                                        <div class="heading-title">
                                            <h6>Notifications</h6>
                                        </div>
                                        <span>5 New</span>
                                    </div>

                                    <div class="notifications-box" id="notificationsBox">
                                        <a href="#" class="dropdown-item"><i class="ti-face-smile bg-success"></i><span>We've got something for you!</span></a>
                                        <a href="#" class="dropdown-item"><i class="zmdi zmdi-notifications-active bg-danger"></i><span>Domain names expiring on Tuesday</span></a>
                                        <a href="#" class="dropdown-item"><i class="ti-check"></i><span>Your commissions has been sent</span></a>
                                        <a href="#" class="dropdown-item"><i class="ti-heart bg-success"></i><span>You sold an item!</span></a>
                                        <a href="#" class="dropdown-item"><i class="ti-bolt bg-warning"></i><span>Security alert for your linked Google account</span></a>
                                        <a href="#" class="dropdown-item"><i class="ti-face-smile bg-success"></i><span>We've got something for you!</span></a>
                                        <a href="#" class="dropdown-item"><i class="zmdi zmdi-notifications-active bg-danger"></i><span>Domain names expiring on Tuesday</span></a>
                                        <a href="#" class="dropdown-item"><i class="ti-check"></i><span>Your commissions has been sent</span></a>
                                        <a href="#" class="dropdown-item"><i class="ti-heart bg-success"></i><span>You sold an item!</span></a>
                                        <a href="#" class="dropdown-item"><i class="ti-bolt bg-warning"></i><span>Security alert for your linked Google account</span></a>
                                    </div>
                                </div>
                            </div>
                        </li>

                        <li class="nav-item dropdown">
                            <button type="button" class="btn dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><img class="border-radius-50" src="img/member-img/1.png" alt=""></button>
                            <div class="dropdown-menu dropdown-menu-right">
                                <!-- User Profile Area -->
                                <div class="user-profile-area">
                                    <div class="user-profile-heading">
                                        <!-- Thumb -->
                                        <div class="profile-thumbnail">
                                            <img class="border-radius-50" src="img/member-img/1.png" alt="">
                                        </div>
                                        <!-- Profile Text -->
                                        <div class="profile-text">
                                            <h6>Ajoy Das</h6>
                                            <span>ajoydas@example.com</span>
                                        </div>
                                    </div>
                                    <a href="#" class="dropdown-item"><i class="ti-user text-default" aria-hidden="true"></i> My profile</a>
                                    <a href="#" class="dropdown-item"><i class="zmdi zmdi-email-open text-success" aria-hidden="true"></i> Messages</a>
                                    <a href="#" class="dropdown-item"><i class="ti-settings text-default" aria-hidden="true"></i> Account settings</a>
                                    <a href="#" class="dropdown-item"><i class="ti-heart text-purple" aria-hidden="true"></i> Support</a>
                                    <a href="#" class="dropdown-item"><i class="ti-unlink text-warning" aria-hidden="true"></i> Sign-out</a>
                                </div>
                            </div>
                        </li>
                    </ul>
                </div>
            </header>

            <!-- Main Content Area -->
            <div class="main-content">
                <div class="container-fluid">
                    <div class="row">
                        <!-- Right Sidebar -->
                        <div class="col-12">
                            <div class="card">
                                <div class="card-body">
                                    <div class="email-content-area">
                                        <div class="row align-items-stretch">
                                            <div class="mail-sidebar col-sm-5 col-md-3 col-xl-2">
                                                <button type="button" class="btn btn-primary btn-block mb-30 mt-4" data-toggle="modal" data-target="#compose-modal">Compose</button>
                                                <div class="menu-bar">
                                                    <ul class="menu-items">
                                                        <li class="active"><a href="#"><i class="icon_mail_alt"></i> Inbox</a><span class="badge badge-pill badge-success">8</span></li>
                                                        <li><a href="#"><i class="icon_desktop"></i> Starred</a></li>
                                                        <li><a href="#"><i class="icon_star_alt"></i> Sent</a></li>
                                                        <li><a href="#"><i class="icon_clock_alt"></i> Important</a></li>
                                                        <li><a href="#"><i class="icon_document_alt"></i> Draft</a><span class="badge badge-pill badge-danger">4</span></li>
                                                        <li><a href="#"><i class="icon_error-circle_alt"></i> Spam</a><span class="badge badge-pill badge-danger">4</span></li>
                                                        <li><a href="#"><i class="icon_trash_alt"></i> Trash</a></li>
                                                    </ul>

                                                    <h6 class="chat mt-30 mb-15 font-15">LABEL</h6>
                                                    <ul class="menu-items">
                                                        <li><a href="#"><i class="icon_folder-alt"></i> Social</a></li>
                                                        <li><a href="#"><i class="icon_folder-alt"></i> Promotions</a></li>
                                                        <li><a href="#"><i class="icon_folder-alt"></i> Updates</a></li>
                                                        <li><a href="#"><i class="icon_folder-alt"></i> Business</a></li>
                                                        <li><a href="#"><i class="icon_folder-alt"></i> Finance</a></li>
                                                    </ul>

                                                    <div class="mail-title mt-30 mb-20">
                                                        <div class="online-status d-flex justify-content-between align-items-center">
                                                            <h6 class="chat mb-0">Chats</h6> <span class="font-14"><i class="fa fa-circle text-success"></i> Online</span>
                                                        </div>
                                                    </div>

                                                    <!-- Mail profile list area -->
                                                    <ul class="mail-profile-list">
                                                        <li class="mail-profile-list-item">
                                                            <a class="mail-client d-flex align-items-center" href="#">
                                                                <!-- Thumb -->
                                                                <span class="thumb">
                                                                    <img src="img/member-img/1.png" alt="">
                                                                </span>
                                                                <!-- User -->
                                                                <div class="user">
                                                                    <h6 class="u-name mb-0 font-15">Ajoy</h6>
                                                                    <p class="mb-0 font-13">Developer</p>
                                                                </div>
                                                            </a>
                                                        </li>

                                                        <li class="mail-profile-list-item">
                                                            <a class="mail-client d-flex align-items-center" href="#">
                                                                <!-- Thumb -->
                                                                <span class="thumb">
                                                                    <img src="img/member-img/2.png" alt="">
                                                                </span>
                                                                <!-- User -->
                                                                <div class="user">
                                                                    <h6 class="u-name mb-0 font-15">Nazrul</h6>
                                                                    <p class="mb-0 font-13">Python Developer</p>
                                                                </div>
                                                            </a>
                                                        </li>

                                                        <li class="mail-profile-list-item">
                                                            <a class="mail-client d-flex align-items-center" href="#">
                                                                <!-- Thumb -->
                                                                <span class="thumb">
                                                                    <img src="img/member-img/3.png" alt="">
                                                                </span>
                                                                <!-- User -->
                                                                <div class="user">
                                                                    <h6 class="u-name mb-0 font-15">Suma</h6>
                                                                    <p class="mb-0 font-13">Python Developer</p>
                                                                </div>
                                                            </a>
                                                        </li>

                                                        <li class="mail-profile-list-item">
                                                            <a class="mail-client d-flex align-items-center" href="#">
                                                                <!-- Thumb -->
                                                                <span class="thumb">
                                                                    <img src="img/member-img/4.png" alt="">
                                                                </span>
                                                                <!-- User -->
                                                                <div class="user">
                                                                    <h6 class="u-name mb-0 font-15">David</h6>
                                                                    <p class="mb-0 font-13">Python Developer</p>
                                                                </div>
                                                            </a>
                                                        </li>
                                                    </ul>
                                                </div>
                                            </div>

                                            <!-- Mail List Area -->
                                            <div class="mail-list-area col-sm-7 col-md-4 pt-4 pb-4 border-right">
                                                <div class="border-bottom pb-4 mb-3 px-3">
                                                    <div class="form-group">
                                                        <input class="form-control w-100" type="search" placeholder="Search mail" id="Mail-rearch">
                                                    </div>
                                                </div>
                                                <div class="mail-list pb-2">
                                                    <div class="mail-icon mr-2">
                                                        <div class="custom-control custom-checkbox">
                                                            <input type="checkbox" class="custom-control-input" id="customCheck1">
                                                            <label class="custom-control-label" for="customCheck1"></label>
                                                        </div>
                                                        <i class="fa fa-star"></i>
                                                        <i class="fa fa-bookmark-o" aria-hidden="true"></i>
                                                    </div>

                                                    <div class="content">
                                                        <div class="d-flex align-items-center mb-2">
                                                            <img class="mail-img mr-2" src="img/member-img/1.png" alt="">
                                                            <p class="sender-name">David Moore</p>
                                                        </div>
                                                        <p class="message_text">Hi Emily, Please be informed that. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                                    </div>
                                                    <div class="time">
                                                        <p>1:20pm</p>
                                                    </div>
                                                </div>
                                                <div class="mail-list new_mail pb-2 pt-2">
                                                    <div class="mail-icon mr-2">
                                                        <div class="custom-control custom-checkbox">
                                                            <input type="checkbox" class="custom-control-input" id="customCheck2">
                                                            <label class="custom-control-label" for="customCheck2"></label>
                                                        </div>
                                                        <i class="fa fa-star"></i>
                                                        <i class="fa fa-bookmark-o" aria-hidden="true"></i>
                                                    </div>

                                                    <div class="content">
                                                        <div class="d-flex align-items-center mb-2">
                                                            <img class="mail-img mr-2" src="img/member-img/2.png" alt="">
                                                            <p class="sender-name">Microsoft Account</p>
                                                        </div>
                                                        <p class="message_text">Hi Emily, Please be informed that. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                                    </div>
                                                    <div class="time">
                                                        <p>11:20pm</p>
                                                    </div>
                                                </div>
                                                <div class="mail-list pb-2 pt-2">
                                                    <div class="mail-icon mr-2">
                                                        <div class="custom-control custom-checkbox">
                                                            <input type="checkbox" class="custom-control-input" id="customCheck3">
                                                            <label class="custom-control-label" for="customCheck3"></label>
                                                        </div>
                                                        <i class="fa fa-star"></i>
                                                        <i class="fa fa-bookmark-o" aria-hidden="true"></i>
                                                    </div>

                                                    <div class="content">
                                                        <div class="d-flex align-items-center mb-2">
                                                            <img class="mail-img mr-2" src="img/member-img/3.png" alt="">
                                                            <p class="sender-name">Sophia Lara</p>
                                                        </div>
                                                        <p class="message_text">Hi Emily, Please be informed that. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                                    </div>
                                                    <div class="time">
                                                        <p>1:20pm</p>
                                                    </div>
                                                </div>
                                                <div class="mail-list pb-2 pt-2">
                                                    <div class="mail-icon mr-2">
                                                        <div class="custom-control custom-checkbox">
                                                            <input type="checkbox" class="custom-control-input" id="customCheck4">
                                                            <label class="custom-control-label" for="customCheck4"></label>
                                                        </div>
                                                        <i class="fa fa-star"></i>
                                                        <i class="fa fa-bookmark-o" aria-hidden="true"></i>
                                                    </div>

                                                    <div class="content">
                                                        <div class="d-flex align-items-center mb-2">
                                                            <img class="mail-img mr-2" src="img/member-img/4.png" alt="">
                                                            <p class="sender-name">Ajoy Das</p>
                                                        </div>
                                                        <p class="message_text">Hi Emily, Please be informed that. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                                    </div>
                                                    <div class="time">
                                                        <p>1:20pm</p>
                                                    </div>
                                                </div>

                                                <div class="mail-list pb-2 pt-2">
                                                    <div class="mail-icon mr-2">
                                                        <div class="custom-control custom-checkbox">
                                                            <input type="checkbox" class="custom-control-input" id="customCheck5">
                                                            <label class="custom-control-label" for="customCheck5"></label>
                                                        </div>
                                                        <i class="fa fa-star"></i>
                                                        <i class="fa fa-bookmark-o" aria-hidden="true"></i>
                                                    </div>

                                                    <div class="content">
                                                        <div class="d-flex align-items-center mb-2">
                                                            <img class="mail-img mr-2" src="img/member-img/5.png" alt="">
                                                            <p class="sender-name">Daniel Russel</p>
                                                        </div>
                                                        <p class="message_text">Hi Emily, Please be informed that. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                                    </div>
                                                    <div class="time">
                                                        <p>7:20pm</p>
                                                    </div>
                                                </div>

                                                <div class="mail-list pb-2 pt-2">
                                                    <div class="mail-icon mr-2">
                                                        <div class="custom-control custom-checkbox">
                                                            <input type="checkbox" class="custom-control-input" id="customCheck6">
                                                            <label class="custom-control-label" for="customCheck6"></label>
                                                        </div>
                                                        <i class="fa fa-star"></i>
                                                        <i class="fa fa-bookmark-o" aria-hidden="true"></i>
                                                    </div>

                                                    <div class="content">
                                                        <div class="d-flex align-items-center mb-2">
                                                            <img class="mail-img mr-2" src="img/member-img/6.png" alt="">
                                                            <p class="sender-name">Sarah Graves</p>
                                                        </div>
                                                        <p class="message_text">Hi Emily, Please be informed that. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                                    </div>
                                                    <div class="time">
                                                        <p>3:10pm</p>
                                                    </div>
                                                </div>
                                                <div class="mail-list pb-2 pt-2">
                                                    <div class="mail-icon mr-2">
                                                        <div class="custom-control custom-checkbox">
                                                            <input type="checkbox" class="custom-control-input" id="customCheck7">
                                                            <label class="custom-control-label" for="customCheck7"></label>
                                                        </div>
                                                        <i class="fa fa-star"></i>
                                                        <i class="fa fa-bookmark-o" aria-hidden="true"></i>
                                                    </div>

                                                    <div class="content">
                                                        <div class="d-flex align-items-center mb-2">
                                                            <img class="mail-img mr-2" src="img/member-img/7.png" alt="">
                                                            <p class="sender-name">Bruno King</p>
                                                        </div>
                                                        <p class="message_text">Hi Emily, Please be informed that. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                                    </div>
                                                    <div class="time">
                                                        <p>1:20pm</p>
                                                    </div>
                                                </div>

                                                <div class="mail-list pb-2 pt-2">
                                                    <div class="mail-icon mr-2">
                                                        <div class="custom-control custom-checkbox">
                                                            <input type="checkbox" class="custom-control-input" id="customCheck11">
                                                            <label class="custom-control-label" for="customCheck11"></label>
                                                        </div>
                                                        <i class="fa fa-star"></i>
                                                        <i class="fa fa-bookmark-o" aria-hidden="true"></i>
                                                    </div>

                                                    <div class="content">
                                                        <div class="d-flex align-items-center mb-2">
                                                            <img class="mail-img mr-2" src="img/member-img/3.png" alt="">
                                                            <p class="sender-name">Sarah Graves</p>
                                                        </div>
                                                        <p class="message_text">Hi Emily, Please be informed that. Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
                                                    </div>
                                                    <div class="time">
                                                        <p>1:20pm</p>
                                                    </div>
                                                </div>
                                            </div>

                                            <div class="mail-view d-none d-md-block col-md-5 col-xl-6 bg-white">
                                                <div class="row">
                                                    <div class="col-md-12 mb-4 mt-4">
                                                        <div class="btn-toolbar">
                                                            <div class="btn-group">
                                                                <button type="button" class="btn btn-sm btn-outline-primary mb-2"><i class="mdi mdi-reply text-primary mr-1"></i> Reply</button>
                                                                <button type="button" class="btn btn-sm btn-outline-primary mb-2"><i class="mdi mdi-reply-all text-primary mr-1"></i>Reply All</button>
                                                                <button type="button" class="btn btn-sm btn-outline-primary mb-2"><i class="mdi mdi-share text-primary mr-1"></i>Forward</button>
                                                            </div>
                                                            <div class="btn-group">
                                                                <button type="button" class="btn btn-sm btn-outline-primary mb-2"><i class="mdi mdi-attachment text-primary mr-1"></i>Attach</button>
                                                                <button type="button" class="btn btn-sm btn-outline-primary mb-2"><i class="mdi mdi-delete text-primary mr-1"></i>Delete</button>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>

                                                <!-- Message Body -->
                                                <div class="message-body">
                                                    <div class="sender-details d-flex align-items-center mb-30">
                                                        <img class="border-radius-50 user-img mr-3" src="img/member-img/mail-6.jpg" alt="">
                                                        <div class="details">
                                                            <p class="mb-1 font-12 text-dark">Weekly Update - Week 13 (May 5, 2019 - May 14, 2019)</p>
                                                            <p class="sender-email mb-0">Ajoy Das, <a class="text-dark" href="#">example@gmail.com</a>
                                                            </p>
                                                        </div>
                                                    </div>
                                                    <div class="message-content">
                                                        <h6>Hi Soma,</h6>
                                                        <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui.</p>

                                                        <p class="mb-30">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sunt est id iste laboriosam, nostrum cupiditate. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Incidunt, sed!</p>
                                                        <h6 class="font-15 mb-0">Regards,</h6>
                                                        <p class="mb-30">Ajoy Das</p>
                                                    </div>

                                                    <div class="row">
                                                        <div class="col-12">
                                                            <h6 class="mb-20">Attachments</h6>
                                                        </div>
                                                        <div class="col-md-4 col-xl-2">
                                                            <div class="mb-3">
                                                                <a href="javascript:void(0);"><img src="img/gallery-img/2.jpg" alt=""></a>
                                                                <h6 class="mt-3 mb-0 font-12">Design.zip</h6>
                                                                <p class="mb-0">2.3 MB</p>
                                                            </div>
                                                        </div> <!-- end col -->

                                                        <div class="col-md-4 col-xl-2">
                                                            <div class="mb-3">
                                                                <a href="javascript:void(0);"><img src="img/gallery-img/3.jpg" alt=""></a>
                                                                <h6 class="mt-3 mb-0 font-12">Design.zip</h6>
                                                                <p class="mb-0">3.3 MB</p>
                                                            </div>
                                                        </div> <!-- end col -->

                                                        <div class="col-md-4 col-xl-2">
                                                            <div class="mb-3">
                                                                <a href="javascript:void(0);"><img src="img/gallery-img/7.jpg" alt=""></a>
                                                                <h6 class="mt-3 mb-0 font-12">Design.zip</h6>
                                                                <p class="mb-0">2.3 MB</p>
                                                            </div>
                                                        </div> <!-- end col -->
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div> <!-- end card-box -->
                        </div> <!-- end Col -->

                        <!-- Compose Modal -->
                        <div id="compose-modal" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="compose-header-modalLabel" aria-hidden="true">
                            <div class="modal-dialog">
                                <div class="modal-content">
                                    <div class="modal-header modal-colored-header bg-primary">
                                        <h4 class="modal-title text-white" id="compose-header-modalLabel">New Message</h4>
                                        <button type="button" class="close text-white" data-dismiss="modal" aria-hidden="true">×</button>
                                    </div>
                                    <div class="modal-body p-3">
                                        <form class="p-1">
                                            <div class="form-group mb-2">
                                                <label for="msgto">To</label>
                                                <input type="text" id="msgto" class="form-control" placeholder="example@email.com">
                                            </div>
                                            <div class="form-group mb-2">
                                                <label for="mailsubject">Subject</label>
                                                <input type="text" id="mailsubject" class="form-control" placeholder="your subject">
                                            </div>
                                            <div class="form-group write-mdg-box mb-3">
                                                <label>Message</label>
                                                <textarea id="simplemde1"></textarea>
                                            </div>

                                            <button type="button" class="btn btn-primary mr-2" data-dismiss="modal"><i class="zmdi zmdi-mail-send mr-1"></i> Send Message</button>
                                            <button type="button" class="btn btn-light" data-dismiss="modal">Cancel</button>
                                        </form>
                                    </div>
                                </div><!-- /.modal-content -->
                            </div><!-- /.modal-dialog -->
                        </div><!-- /.modal -->
                    </div>

                    <!-- Small Chat Box -->
                    <div class="small-chat-box fadeInRight animated">
                        <div class="heading d-flex align-items-center" draggable="true">
                            <img class="chat-thumb mr-3" src="img/member-img/1.png" alt="">
                            <div class="chat-header">
                                <h6 class="mb-0">Jhon Smith</h6>
                                <p class="mb-0 font-12 text-green">Active</p>
                            </div>
                        </div>

                        <div class="chat-history bg-img" id="chat-conversation" style="background-image: url(img/bg-img/4.jpg);">
                            <ul>
                                <li class="clearfix mb-15">
                                    <div class="message-data text-right">
                                        <span class="mr-2"><img class="chat-img" src="img/member-img/1.png" alt=""></span>
                                        <span class="message-data-time font-11">11:11 AM, Today</span>
                                    </div>
                                    <div class="message other-message float-right font-12">Hi Robert , how are you?</div>
                                </li>
                                <li class="clearfix mb-15">
                                    <div class="message-data">
                                        <span class="mr-2"><img class="chat-img" src="img/member-img/2.png" alt=""></span>
                                        <span class="message-data-time font-11">11:15 AM, Today</span>
                                    </div>
                                    <div class="message my-message font-12">Fine. and you?</div>
                                </li>
                                <li class="clearfix mb-15">
                                    <div class="message-data">
                                        <span class="mr-2"><img class="chat-img" src="img/member-img/2.png" alt=""></span>
                                        <span class="message-data-time font-11">11:16 AM, Today</span>
                                    </div>
                                    <div class="message my-message font-12">Fine. What's about vacation?.</div>
                                </li>
                                <li class="clearfix">
                                    <div class="message-data text-right">
                                        <span class="mr-2"><img class="chat-img" src="img/member-img/1.png" alt=""></span>
                                        <span class="message-data-time font-11">11:18 AM, Today</span>
                                    </div>
                                    <div class="message other-message float-right font-12">We think for next weekend.</div>
                                    <div class="message other-message float-right font-12">Have fun!</div>
                                </li>
                            </ul>
                        </div>

                        <div class="form-chat">
                            <div class="input-group chat-group">
                                <input type="text" class="form-control">
                                <span class="input-group-btn">
                                    <button class="btn btn-primary" type="button">Send
                                    </button> </span></div>
                        </div>
                    </div>
                    <div id="small-chat">
                        <span class="badge badge-primary float-right">6</span>
                        <a class="open-small-chat pulse" href="#">
                            <i class="zmdi zmdi-comment-more"></i>
                        </a>
                    </div>
                </div>

                <!-- Footer Area -->
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-12">
                            <!-- Footer Area -->
                            <footer class="footer-area">
                                <!-- Copywrite Text -->
                                <div class="copywrite-text text-center">
                                    <p>Undex &copy; 2019 created by <a href="#">Theme-zome</a></p>
                                </div>
                            </footer>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- ======================================
    ********* Page Wrapper Area End ***********
    ======================================= -->

    <!-- Must needed plugins to the run this Template -->
    <script src="js/jquery.min.js"></script>
    <script src="js/popper.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/bundle.js"></script>

    <!-- Active JS -->
    <script src="js/default-assets/fullscreen.js"></script>
    <script src="js/default-assets/active.js"></script>

    <!-- These plugins only need for the run this page -->
    <script src="js/default-assets/simplemde.min.js"></script>
    <script src="js/default-assets/demo.inbox.js"></script>
    <script src="js/default-assets/dashboard-chat.js"></script>

</body>


<!-- Mirrored from demo.riktheme.com/undex-1/side-menu-dark/inbox.html by HTTrack Website Copier/3.x [XR&CO'2014], Mon, 21 Oct 2019 10:39:04 GMT -->
</html>